.account-view{
  background-color: #f0f0f0;
}
.account-profile{
  overflow: hidden;
  position: relative;
  padding: 59/75rem 0 23/75rem;
  background: url("../../assets/account-bg.jpg");
  background-size:cover ;
  background-repeat: no-repeat;
  background-position: top center;
  .setting{
    position: absolute;
    display: block;
    top: 30/75rem;
    right: 30/75rem;
    color: #333;
    .Icon{
      width: 60/75rem;
      height: 60/75rem;
    }
  }
  .avatar{
    position: relative;
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 50%;
    border:4px solid #fff;
    margin: 0 auto;
    overflow: hidden;
    background-color: #fff;
    box-shadow: 0px 8/75rem 20/75rem #ffc892;
    img{
      display: block;
      width: 100%;
      height: 100%;
    }
  }
  p{
    position: relative;
    margin-top: 25/75rem;
    text-align: center;
    font-size: 1.2em;
    color: #333
  }
  a{
    color: #333;
  }
}
.account-info{
  display: flex;
  margin-top: 20/75rem;
  .item{
    flex: 1;
    text-align: center;
    .p-num{
      color: #feae29;
    }
  }
}
.account-order{
  margin-top: .2rem;
  background-color: #fff;
  border-bottom: 1px solid #f0f0f0;
  .top{
    display: flex;
    position: relative;
    justify-content:space-between;
    &:after{
      content: '';
      bottom: 0;
      width: 100%;
      height: 0;
      left: 0;
      position: absolute;
      border-bottom: 1px solid #f0f0f0;
      transform: scale(1,.5);
    }
    a{
      display: block;
      flex:1;
      padding: .24rem;
      position: relative;
      text-align: center;
      .Icon{
        width:40/75rem ;
        height: 40/75rem;
        fill: #b2b2b2;
      }
      p{
        color: #333;
      }
      span{
        position: absolute;
        left: 50%;
        top: .5em;
        display: block;
        border-radius: .8em;
        font-size: .9em;
        line-height: 1;
        padding: .2em .6em;
        background-color: #f44336;
        color: #fff;
      }
    }
  }
}

.account-menu{
  overflow: hidden;
  margin-top: .2rem;
  background-color: #fff;
  padding-bottom: 97/75rem;
  a{
    display: block;
    flex: 1;
    width: 25%;
    float: left;
    padding: .3rem;
    text-align: center;
    span{
      display: block;
      margin: 0 auto;
      color: #fff;
      .Icon{
        width: 80/75rem;
        height: 80/75rem;
      }
    }
    p{
      color: #000;
    }
    &:nth-child(1) .Icon{
      fill: #f5803a;
    }
    &:nth-child(2) .Icon{
      fill: #f45762;
    }
    &:nth-child(3) .Icon{
      fill: #f45787;
    }
    &:nth-child(4) .Icon{
      fill: #5796f4;
    }
    &:nth-child(5) .Icon{
      fill: #ff9c0a;
    }
    &:nth-child(6) .Icon{
      fill: #02b244;
    }
    &:nth-child(7) .Icon{
      fill: #fcb133;
    }
  }
}